                                            <!-- 左右对称标识组件 -->
<!-- 可传递属性 -->
<!-- leftText:左边文字简介
      rightText:右边内容介绍 -->
<template>
  <div class="leftAndRight">
    <!-- 左边文字简介 -->
    <div class="leftAndRight-left" v-html="leftText"></div>
    <!-- 右边内容介绍 -->
    <div class="leftAndRight-right" v-html="rightText"></div>
  </div>
</template>

<script>
export default {
  props: {
    // 左边文字简介
    leftText: {
      type: [String],
      default: "家庭信息",
    },

    // 右边内容介绍
    rightText: {
      type: [String],
      default: "四川省XXXXXXX",
    },
  },
  data() {
    return {};
  },
  methods: {},
};
</script>

<style>
/* 外层样式 */
.leftAndRight {
  width: 100%;
  height: 20px;
  border: solid 1px;
  display: flex;
  font-size: 15px;
  font-weight: 500;
  text-align: left;
}

/* 左边文字简介 */
.leftAndRight-left {
  padding: 0 10px 0 0;
  border-right: solid 1px;
}

/* 右边内容介绍 */
.leftAndRight-right {
}
</style>
